<script setup>
// import useRequest from '../composable/useRequest';
import useTodo from '../composable/useTodo';
const {del} = useTodo();
// const request = useRequest()
/*接收父组件的数据defineProps*/
const {todo} = defineProps({
  todo: {type:Object,required:true}
})
/*传递给父组件的方法*/
// const emit = defineEmits(['del'])
/*删除数据 */
// const del = async () =>{
//   await request.delete(todo.id)
//   /*删除之后调用一下这个动作 */
//   emit('del')
// }
</script>

<template>
  <div id="item">
    {{todo.id}}
    <input type="text" :value="todo.content">
    <button @click="del(todo.id)">删除</button>
  </div>
</template>


<style scoped>
#item {
  padding: 10px;
  display: flex;
  flex-direction: row;
}
div input{
  outline:none;
  padding: 10px;
  flex: 1;
}
.item button{
  margin-left: 10px;
  background-color: #e74c3c;
  color: #fff;
  border:none;
  padding: 5px 10px;
}
</style>